<template>
  <div class="content">
    <div class="cont">
      <div>
        <span>原密码</span>
        <input type="text" v-model="inpForm.origPass" />
      </div>
      <div>
        <span>新密码</span>
        <input type="text" v-model="inpForm.newPass" />
      </div>
      <div>
        <span>确认密码</span>
        <input type="text" v-model="inpForm.verifyPass" />
      </div>
    </div>
    <button @click="saveClick">保存</button>
  </div>
</template>

<script>
import { UPDATA_NAME_AND_PASS } from '@/api'

export default {
  components: {},
  props: {},
  data () {
    return {
      form: {},
      inpForm: {
        origPass: '',
        newPass: '',
        verifyPass: ''
      }
    }
  },
  computed: {
    account () {
      return this.$store.state.account
    },
    getUrlForm () {
      return JSON.parse(this.$root.$mp.query.item)
    }
  },
  watch: {},
  created () {},
  mounted () {},
  onShow () {
    this.setFormVlaue()
  },
  methods: {
    setFormVlaue () {
      const vm = this
      vm.form = vm.getUrlForm
    },
    saveClick () {
      const vm = this
      if (!vm.inpForm.origPass) {
        vm.$toast('原密码不能为空')
      } else if (!vm.inpForm.newPass) {
        vm.$toast('新密码不能为空')
      } else if (!vm.inpForm.verifyPass) {
        vm.$toast('确认密码不能为空')
      } else if (
        vm.inpForm.newPass !== vm.inpForm.verifyPass &&
        vm.inpForm.verifyPass !== vm.inpForm.newPass
      ) {
        vm.$toast('两次密码不一致')
      } else {
        let params = {
          adminId: vm.form.adminId,
          oldPwd: vm.inpForm.origPass,
          newPwd: vm.inpForm.newPass,
          rePwd: vm.inpForm.verifyPass
        }
        vm.shopAdminUpdate(params)
      }
    },
    shopAdminUpdate (params) {
      const vm = this
      UPDATA_NAME_AND_PASS(params)
        .then(r => {
          if (r.data.code === '0' && r.data.data) {
            vm.$alert('修改成功', '').then(() => {
              vm.$router.go(-1)
            })
          } else {
            vm.$toast(r.data.message)
          }
        })
        .catch(e => {
          console.error(e)
        })
    }
  }
}
</script>

<style lang="scss" scoped>
@import 'static/styles/color.scss';
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  .cont {
    width: 90%;
    div {
      width: 90%;
      font-size: 13px;
      display: flex;
      flex-direction: row;
      color: #000;
      justify-content: space-between;
      margin: 15px 0;
      input {
        width: 80%;
      }
    }
  }
  button {
    width: 90%;
    height: 34px;
    border-radius: 25px;
    background: #626efd;
    color: #fff;
    font-size: 14px;
    margin-top: 50px;
  }
}
</style>
